<template lang="html">
	<div class="Register_box">
		<img src="../../assets/img/banner/banenr_1.png" height="500" width="750" class="Register_img">
		<form class="Register_form">
			<div>
				<i class="tel_icon"></i>
				<input type="tel" name="tel" placeholder="手机号">
			</div>
			<div class="code_box">
				<i class="code_icon"></i>
				<input type="tel" name="code" placeholder="验证码">
				<div class="code" v-on:click="code()">获取验证码</div>
			</div>
			<div>
				<i class="pwd_icon"></i>
				<input type="password" name="pwd" placeholder="登录密码">
			</div>
			<div>
				<i class="pwdq_icon"></i>
				<input type="password" name="pwdq" placeholder="确认密码">
			</div>
			<div class="Register_btn" v-on:click="say()">注册</div>
		</form>
	</div>
</template>
<script type="text/javascript">
	export default {
	  name: 'App',
	  data(){
	    return {
	      codeyanzhan:0
	    }
	  },
	  methods:{
	    say:function(){
		    let tel = document.getElementsByName("tel")[0].value,
		    code = document.getElementsByName("code")[0].value,
		    pwd = document.getElementsByName("pwd")[0].value,
		    pwdq = document.getElementsByName("pwdq")[0].value,
		    qs = require('querystring'),
		    self = this;
	      	if(!tel){
	      		self.$toast('手机号不能为空！');
	      		return false;
	      	}else {
	      		var reg=/^1[0-9]{10}/;
	      		if (!reg.test(tel)) {
	      			self.$toast('手机号不正确！');
	      			return false;
	      		}
	      	}
	      	if(!code){
	      		self.$toast('验证码不能为空！');
	      		return false;
	      	}
	      	if (!pwd) {
	      		self.$toast('登录密码不能为空！');
	      		return false;
	      	}
	      	if (!pwdq) {
	      		self.$toast('确定密码不能为空！');
	      		return false;
	      	}
	      	if(pwd != pwdq){
	      		self.$toast('登录密码和确定密码不相等！');
	      		return false;
	      	}
	      	self.$loading('注册中');
        	var _url="http://192.168.1.61/newshengjigongsisvn/php//index.php?g=app&m=shopping&a=regist_post"; 
		    var _data={
		    	user_login:tel,
		    	yanzhengma:code,
		    	user_pass:pwd
		    };
		    self.ajxashuju({
			    method: 'POST',
			    url: _url,
			    data: _data,
			    success: function (response) {
			    	response = JSON.parse(response);
			       if(response.status=="1"){
			       		self.$loading.close();
						self.$loading('注册成功！请去登录');
						window.setTimeout(function(){
							window.location.href = "index.html";
						},1500)
			       }else {
			       		self.$loading.close();
			       		self.$toast(response.data.info);
			       }
			    }
			});
	    },
	    code:function(){
	    	let tel = document.getElementsByName("tel")[0],
	    	code = document.getElementsByClassName('code')[0],
	    	qs = require('querystring'),
	    	i = 60,
	    	self = this;
	    	if(self.codeyanzhan != 0){
	    		return false;
	    	}
	    	if(!tel.value){
	    		this.$toast('手机号不能为空！');
	      		return false;
	    	}
	    	var _url="http://192.168.1.61/newshengjigongsisvn/php//index.php?g=app&m=shopping&a=regist_post"; 
		    var _data={
		    	user_login:tel
		    }
	    	var myInterceptor = self.$http.interceptors.response.use(function(){/*....*/});
		    self.$http.interceptors.response.eject(myInterceptor);
		    self.$http.post(_url,qs.stringify(_data)).then(function(data){
		    	alert(data);
		        if(data.data.status== "1"){
		        	self.$loading.close();
		        	
		        }else {
		        	self.$loading.close();
		        	self.$toast(data.data.info);
		        }
		    },function(response){
		        self.$toast(response.data);
		    })
	    	code.style.backgroundColor = '#999';
	    	let timeset = window.setInterval(function(){
	    		i--;
	    		code.innerHTML = "重新获取("+i+")";
	    		if(i<1){
	    			window.clearInterval(timeset)
	    			code.innerHTML = "重新获取";
	    			code.style.backgroundColor = '#e74c4c';
	    			self.codeyanzhan = 0;
	    		}
	    	},1000);
	    	self.codeyanzhan = 1;
	    },
	    ajxashuju:function(opt){
	    	opt = opt || {};
	        opt.method = opt.method.toUpperCase() || 'POST';
	        opt.url = opt.url || '';
	        opt.async = opt.async || true;
	        opt.data = opt.data || null;
	        opt.success = opt.success || function () {};
	        var xmlHttp = null;
	        if (XMLHttpRequest) {
	            xmlHttp = new XMLHttpRequest();
	        }
	        else {
	            xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
	        }
	        var params = [];
	        for (var key in opt.data){
	            params.push(key + '=' + opt.data[key]);
	        }
	        var postData = params.join('&');
	        if (opt.method.toUpperCase() === 'POST') {
	            xmlHttp.open(opt.method, opt.url, opt.async);
	            xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
	            xmlHttp.send(postData);
	        }
	        else if (opt.method.toUpperCase() === 'GET') {
	            xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async);
	            xmlHttp.send(null);
	        } 
	        xmlHttp.onreadystatechange = function () {
	            if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
	                opt.success(xmlHttp.responseText);
	            }
	        };
		}
	  },
	  components:{

	  }
	}
</script>

<style scoped lang="less">
	@import '../../assets/less/index.less';
	.Signin_box{

	}
</style>